import 'dart:io';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:path_provider/path_provider.dart';
import 'package:transparent_image/transparent_image.dart';

class ImagesRoute extends StatefulWidget {
  @override
  _ImagesRouteState createState() => _ImagesRouteState();
}

class _ImagesRouteState extends State<ImagesRoute> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("图片控件"),
      ),
      body: Scrollbar(
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              Image(
                height: 200,
                width: 500,
                image: AssetImage("index.jpg"),
                fit: BoxFit.cover,
              ),
              FutureBuilder(
                future: _getLocalFile(),
                builder: (context, snapshot) {
                  if (snapshot.connectionState == ConnectionState.waiting) {
                    return Text("加载中....");
                  } else if (snapshot.connectionState == ConnectionState.done) {
                    print(snapshot.data);
                    return Image.file(
                      snapshot.data,
                      width: 500,
                      height: 200,
                      fit: BoxFit.cover,
                    );
                  }
                  return null;
                },
              ),
              Container(
                width: 500,
                height: 200,
                child: Stack(
                  children: <Widget>[
                    Center(
                      child: CircularProgressIndicator(),
                    ),
                    Center(
                      child: FadeInImage.memoryNetwork(
                          placeholder: kTransparentImage,
                          image:
                              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1589105105884&di=53893ab116f139387012a703557b2a70&imgtype=0&src=http%3A%2F%2Fhbimg.b0.upaiyun.com%2Fc54b70d49796475dc43b320541eabefd5aeda41023157-jETQVm_fw658"),
                    )
                  ],
                ),
              ),
              Container(
                width: 500,
                height: 200,
                child: Stack(
                  children: <Widget>[
                    Center(
                      child: FadeInImage.assetNetwork(
                          placeholder: "index.jpg",
                          image:
                              "https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=4173661243,99164166&fm=26&gp=0.jpg"),
                    )
                  ],
                ),
              ),
              CachedNetworkImage(
                placeholder: (context, url) => CircularProgressIndicator(),
                imageUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1587205655461&di=a84ee5077160cc354429e0beb26edaf9&imgtype=0&src=http%3A%2F%2Fgss0.baidu.com%2F-4o3dSag_xI4khGko9WTAnF6hhy%2Fzhidao%2Fpic%2Fitem%2F562c11dfa9ec8a132ff6be36f503918fa1ecc07c.jpg',
              ),
              _basicContent()
            ],
          ),
        ),
      ),
    );
  }

  Future<File> _getLocalFile() async {
    var dir = await getExternalStorageDirectory();
    var rootDir = dir.parent.parent.parent.parent;
    var imagesDir = "${rootDir.path}/長澤茉里奈博客图片 459p/ces.jpg";
    var listFile = await rootDir.list().toList();
    for (FileSystemEntity fileSystemEntity in listFile) {
      print(fileSystemEntity.path);
    }
    File file = File(imagesDir);
    bool isS = await file.exists();
    print(isS);
    return file;
  }

  Widget _sizedContainer(Widget child) {
    return SizedBox(
      width: 300.0,
      height: 150.0,
      child: Center(child: child),
    );
  }


  Widget _basicContent() {
    return SingleChildScrollView(
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            _sizedContainer(
              const Image(
                image: CachedNetworkImageProvider(
                  'http://via.placeholder.com/350x150',
                ),
              ),
            ),
            _sizedContainer(
              CachedNetworkImage(
                progressIndicatorBuilder: (context, url, progress) =>
                    CircularProgressIndicator(
                      value: progress.progress,
                    ),
                imageUrl:
                'https://images.unsplash.com/photo-1532264523420-881a47db012d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9',
              ),
            ),
            _sizedContainer(
              CachedNetworkImage(
                placeholder: (context, url) =>
                const CircularProgressIndicator(),
                imageUrl: 'http://via.placeholder.com/200x150',
              ),
            ),
            _sizedContainer(
              CachedNetworkImage(
                imageUrl: 'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=4173661243,99164166&fm=26&gp=0.jpg',
                imageBuilder: (context, imageProvider) => Container(
                  decoration: BoxDecoration(
                    image: DecorationImage(
                      image: imageProvider,
                      fit: BoxFit.cover,
                      colorFilter: const ColorFilter.mode(
                        Colors.red,
                        BlendMode.colorBurn,
                      ),
                    ),
                  ),
                ),
                placeholder: (context, url) =>
                const CircularProgressIndicator(),
                errorWidget: (context, url, error) => const Icon(Icons.error),
              ),
            ),
            CachedNetworkImage(
              imageUrl: 'http://via.placeholder.com/300x300',
              placeholder: (context, url) => const CircleAvatar(
                backgroundColor: Colors.amber,
                radius: 150,
              ),
              imageBuilder: (context, image) => CircleAvatar(
                backgroundImage: image,
                radius: 150,
              ),
            ),
            _sizedContainer(
              CachedNetworkImage(
                imageUrl: 'http://notAvalid.uri',
                placeholder: (context, url) =>
                const CircularProgressIndicator(),
                errorWidget: (context, url, error) => const Icon(Icons.error),
              ),
            ),
            _sizedContainer(
              CachedNetworkImage(
                imageUrl: 'not a uri at all',
                placeholder: (context, url) =>
                const CircularProgressIndicator(),
                errorWidget: (context, url, error) => const Icon(Icons.error),
              ),
            ),
            _sizedContainer(
              CachedNetworkImage(
                imageUrl: 'http://via.placeholder.com/350x200',
                placeholder: (context, url) =>
                const CircularProgressIndicator(),
                errorWidget: (context, url, error) => const Icon(Icons.error),
                fadeOutDuration: const Duration(seconds: 1),
                fadeInDuration: const Duration(seconds: 3),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
